import React, { Component } from 'react';

/*
1组件 更新时
a. setState
*/
class App extends Component {
  static getDerivedStateFromProps(props,state){
    console.log("1 组件更新Apbp getDerivedStateFromProps");
    return null;
  }; 
  shouldComponentUpdate(nextProps,nextState){
    //false=>组件不会更新
    // true=>组件会更新
    console.log("2 组件更新 shouldComponentUpdate");
    return true; 
  }
  state= {
    msg:"（&_&）"
  };
  handleClick= (params) => {
    this.setState({
      msg:"((^00^))"
    })
  } 
  render() {
    console.log("3 组件更新执行render函数"); 
    return (
      <div>
        <h1>{this.state.msg} </h1>
        <button onClick={this.handleClick}>变猪</button>
      </div>
    );
  }
  getSnapshotBeforeUpdate(preProps,preState){
    console.log("4 执行组件更新 getsnapshotBeforeUpdate")
     return null;
  };
  componentDidUpdate(preProps,preState,snapshot){
console.log("5 组件更新 componentDidUpdate");
  };
}

export default App;
